<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        .one{
            margin: 50px auto;
            background-color: bisque;
            padding-left: 300px;
        }
        #two{
            width: 190px;/*工作中一般用width height设置文本框大小*/
            height: 50px;
            resize: none;/*对文本框修饰用resize可固定大小不可拉动右下角符号消失*/
        }
        ul{
            overflow: hidden;
        }
        a{
            color: inherit;清除浏览器默认链接颜色 list-style:none;清除列表默认样式
        }
        a:link{
            color: black;
        }
        a:hover{
            color: brown;
        }
        li{
            list-style: none;
            float: left;
            margin-left: 40px;
        }
    </style>
</head>
<body>
    <div class="one">
        <form action="form_action.asp"  method="post" name="登录页面">
            <input readonly="readonly" value="此风险由您自己承担" size="10"><br>
            <input type="text" disabled="disabled"><br>
            账号：<!--提示信息-->
            <input type="text" name="账号" maxlength="10"><br>
            密码：
            <input type="password" name="密码"><br>
            性别：<br>
            <input type="radio" name="sex">男<br>
            <input type="radio" name="sex" checked>女<br>
            兴趣：<br>
            <label for="dayi">跳舞</label>
            <input type="checkbox"id="dayi" name="interest"><br>
            <input type="checkbox" name="interest">唱歌<br>
            <input type="checkbox" name="interest">运动<br>
            上传头像：
            <input type="file"><br>
            <input type="submit">
            <input type="reset">
            <input type="button" value="普通按钮">
            <input type="image" src="image1"alt="无图片">
            <input type="hidden"><br>
             <select name="" id=""multiple>//创造一个列表其中selected指默认选择，multiple指默认选择可多选
                <option value="">1</option>
                <option value="大二">2</option>
                <option value="" selected>3</option>
                <option value=""selected>4</option>
             </select><br>
             <select name="" id="">
                <optgroup label="北京">
                    <option value="">东</option>
                    <option value="">西</option>
                    <option value="">南</option>
                </optgroup>
                <optgroup label="江苏">//optgroup结合label标签对列表内容进行分组
                    <option value="">北</option>
                    <option value="">西</option>
                    <option value="">东</option>
                </optgroup>
            </select><br>
          <textarea name="" id="">6666666666666666666666666666666666666666666666666666666666666666666666666666666666</textarea>
          <textarea cols="60" rows="3" id="two">6666666666666666666666666666666666666666666666666666666666666666666666666666666666</textarea>
          填邮箱；<input type="email"><br>
          填地址：<input type="url"><br>
          填电话号码：<input type="tel"><br>
          搜索框：<input type="search"><br>
          选择颜色：<input type="color"><br>
          数值框：<input type="number" value="1" min="0" max="100" step="3"><br>
          数值条：<input type="range"><br>
       年月日：   <input type="date">&nbsp;
          年月；<input type="month">&nbsp;
          年和周：<input type="week">&nbsp;
          时间：<input type="time">&nbsp;/*空格*/
         年月日国际时间： <input type="datetime">
       年月日当地时间:   <input type="datetime-local">
       <br>
      请输入内容： <input type="text" list="love">
       <datalist id="love">
        <option value="提示1">111111</option>
        <option >222222</option>
        <option >333333333333</option>
       </datalist> 
        //若存在value则value中一定要有内容否则><中内容的不会显示除非删除value属性
        </form>
        <input type="text"id="form">nihao使input标签可以在表单外但可和表单内容一起提交，id名为form
    </div>
    <ul>
        <li class="u4"><a href="">欢迎</a></li>
        <li class="u5"><a href="">nihao</a></li>
        
    </ul>
</body>
</html>